<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>DreStarting-时间轴</title>
  <!--    抽取公共头部-->
  <div th:replace="share/common :: head"></div>
  <link rel="stylesheet" href="../static/css/timeline.css" th:href="@{/css/timeline.css}">
</head>
<body>

<!--    抽取公共导航-->
<div th:replace="share/common :: menu(3)"></div>

<!--时间轴内容-->
  <div class="doc-container m-padded-tb-massivex m-opacity" id="doc-container">
      <th:block >
        <section class="timeline" id="waypoint">
          <ul>

            <li class="" th:each="blog:${blogs}">
              <div>
                <time th:text="${blog.formateTime2(blog.update_time)}">2020/01/01</time>
                <div class="scientist" >
                    <a href="#" target="_blank" th:href="@{/blog/{blogId}(blogId=${blog.blogId})}">
                      <h3 class="state" style="text-align:center;font-size: 16px;color: #000;" th:text="${blog.title}">文章标题</h3>
                    </a>
                </div>
              </div>
            </li>

          </ul>
        </section>
      </th:block>
  </div>

  <!--置顶图标-->
<div id="toolbar" class="m-padded m-fixed m-right-bottom" style="display: none">
  <div class="ui vertical icon buttons ">
    <div class="ui center aligned basic segment" style="margin-bottom: 0">
      <button id="payButton" class="ui orange basic circular button">滴滴</button>
    </div>
    <a href="#" class="ui center aligned basic segment icon" style="margin-top: 0"><i class="ui medium orange chevron up icon"></i> </a>
  </div>
</div>


<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  <!--    抽取公共footer    -->
  <div th:replace="share/common :: #footer"></div>

  <!--    抽取公共js    -->
  <div th:replace="share/common :: #js"></div>
  <script src="../static/lib/timeline/timeline.js" th:src="@{/lib/timeline/timeline.js}"></script>
</body>
</html>